﻿<!DOCTYPE html>
<html lang="zh">
<head>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta name="renderer" content="webkit">
    <meta http-equiv="CurrData.Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <title>Index </title>
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />

    <link href="/js/kd/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="/js/kd/styles/kendo.blueopal.min.css" rel="stylesheet" />
    <link href="/js/fa/css/font-awesome.min.css" rel="stylesheet" />
    <link href="/js/site.css?t=20221031" rel="stylesheet" />

    <script src="/js/kd/jquery.min.js"></script>
    <script src="/js/kd/kendo.web.min.js"></script>

    <script src="/js/kd/cultures/kendo.culture.zh-CN.min.js"></script>
    <script src="/js/kd/messages/kendo.messages.zh-CN.min.js"></script>
    <script src="/js/kd/jszip.min.js"></script>


    <script src="/js/kendo_stdefine.js"></script>
    <script src="/js/site50.js"></script>
    <script src="/js/xlsx.full.min.js?t=1"></script>


</head>
<body>


    <div id="divSplitter" data-role="splitter"
         data-panes="[
                { collapsible: false, resizable: false,  size: '245px' },
                { collapsible: false, resizable: false }
             ]"
         style="">
        <div id="left-pane" style="overflow:hidden;overflow-y:auto;">
            <div id="toolbarCenter" style="height:40px;line-height:40px;margin-bottom:2px;border-bottom: 1px solid #23549C;background:#14346a;font-family:'Microsoft YaHei'" class="flexrow">
                <div style="flex:1;margin-left:14px;font-size:14px">
                    采集器
                </div>

                <div style="width:20px;color:#5999D4;">

                </div>

                <div style="width:20px;color:#5999D4;">

                </div>
                <div style="width:20px;color:#5999D4;">

                </div>

                <div style="width:20px;color:#5999D4;">

                </div>
                <div style="width:20px;color:#5999D4;">

                </div>




            </div>
            <div id="treeview"
                 data-role="treeview"
                 data-drag-and-drop="false"
                 data-text-field="text"
                 data-id-field="id"
                 data-spritecssclass-field="imageurl"
                 data-bind="source: treeData,
                    events: { change: treeNodeChange }"
                 style="flex-wrap: wrap;overflow-x:hidden;overflow-y:auto ;height:calc( 100% - 45px)">

            </div>

        </div>

        <div id="center" style="overflow: hidden;overflow-y:auto; ">
            <div id="grid" style="height: calc(100% -  5px)"></div>
        </div>


    </div>




    <script>
        var viewModel = new kendo.data.ObservableObject({
            treeNodeChange: function (e) {
                var treeView = $("#treeview").data("kendoTreeView");
                var nodedata = treeView.dataItem(treeView.select());
                if (!nodedata) {

                }



                switch (nodedata.attrs2) {
                    case "A":


                        break;//第一级
                    case "B":

                        break;//第二级
                }
                Page();
            },
            treeData: [],
        });
        var CurrData = {};
        var grid;
        function Init() {
            
            var opt = Object.assign({}, gridBaseOption);

            opt.columns = [

                { title: '序号', field: "RowNo", width: 50, sortable: false, filterable: false, },
                { title: '时间', field: "Dt", width: 80, sortable: false, filterable: false, },
                { title: '机号', field: "ProtocolSimHostName", width: 80, sortable: false, filterable: false, },
                { title: '类型', field: "Lx", width: 50, sortable: false, filterable: false, },
                { title: '数据', field: "Data", width: 300, sortable: false, filterable: false, },
                { title: '备注', field: "Memo", width: 150, sortable: false, filterable: false, },
            ]
            opt.pageable = $.extend(true, {}, KDGridpageable)
            opt.toolbar = kendo.template($("#cmd-template").html());

            grid = $("#grid").kendoGrid(opt).data("kendoGrid");
            kendo.bind($("#divSplitter"), viewModel);

            // 获取当前时间并格式化为 yyyy-MM-dd HH:00:00
            var now = new Date();
            var formattedTime = now.getFullYear() + '-' + 
                       ('0' + (now.getMonth() + 1)).slice(-2) + '-' + 
                       ('0' + now.getDate()).slice(-2) + ' ' + 
                       ('0' + now.getHours()).slice(-2) + ':00:00';
            $("#Dtb").data("kendoDateTimePicker").value(formattedTime);

            GetTree("");
             
        }
        function  Page() {
            var treeView = $("#treeview").data("kendoTreeView");
            var nodedata = treeView.dataItem(treeView.select());

         
            var dataSource = newDataSource({
                jq: $("#grid"),
                url: "/api/ProtocolSimLog/Page",
                getParam: function (data) {
                    var treeView = $("#treeview").data("kendoTreeView");
                    var nodedata = treeView.dataItem(treeView.select());

                    if (nodedata.attrs2 == "A") {
                        data.ProtocolSimId = nodedata.id;
                    } else {
                        data.ProtocolSimHostId = nodedata.id;
                    }
                    data.Key = $("#Key").val();
                    data.dtb = $("#Dtb").data("kendoDateTimePicker").value();
                    data.dte = $("#Dte").data("kendoDateTimePicker").value();
                },
                pageSize: 10,
                page: 1,
            })


            grid.setDataSource(dataSource);
            dataSource.read();
        }
        function GetTree(selid) {
             
            var tv = $("#treeview").data("kendoTreeView");

            myAjax({
                url: "/api/ProtocolSim/Tree",
                success: function (r) {

                    var ohy = kendo.observableHierarchy({
                        data: r.Data
                    });

                    viewModel.set("treeData", ohy);

                    if (selid) {

                        var di = tv.dataSource.get(selid);
                        var bar = tv.findByUid(di.uid);
                        tv.select(bar);
                    } else if (r.Data.length > 0) {
                        var selectedNode = tv.findByText(r.Data[0].text);
                        tv.select(selectedNode);
                    }

                }
            });
        };

    </script>

    <script id="cmd-template" type="text/x-kendo-template">
                     <div id="divTop" style="height:30px; padding:5px;  " class="flexrow">

                         <div style="width:60px;padding-top:5px;padding-right:10px;text-align:right;">
                             <label style="">数据时间</label>
                         </div>
                         <div style="width:200px;">
                             <input id="Dtb" data-role="datetimepicker" data-format="yyyy-MM-dd HH:mm" style="width:200px;" data-value="" />
                         </div>
                         <div style="width:10px;padding-top:5px;padding-right:10px;text-align:right;">
                             <label style="">~</label>
                         </div>
                         <div style="width:200px;">
                             <input id="Dte" data-role="datetimepicker" data-format="yyyy-MM-dd  HH:mm" style="width:200px;" />
                         </div>


                <div style="width:60px;padding-top:5px;padding-right:10px;text-align:right;">
                    <label style="">关键字</label>
                </div>

                      <div style="width:200px;">
                          <input id="Key" Name="Key" class="k-textbox" placeholder="备注关键字"/>
                      </div>


                         <div style="width:20px;">
                     </div>

                           <div style="width:90px;">
                             <a style="width:80px;" onclick='Page();' class='k-button '><span class='k-icon k-i-search'></span>查询</a>
                         </div>

                         <div style="width:90px;text-align:right;">
                             <a class='k-button k-space-left k-grid-excel'><span class='k-icon k-i-excel'></span>导出</a>
                         </div>
                          <div style="flex:1;">
                          </div>
                          <div style="width:20px;">

                          </div>
                     </div>
    </script>
        <script>
            var SizeInfo;
            $(function () {

                kendo.culture("zh-CN");


                if (window.Init) {
                    Init();
                }
            });
            function After50(d) {
                if (d) {
                    setTimeout(function () { d(); }, 50);
                }
            }
    </script>
</body>
</html>
